<template>
  <div style="margin-top: 10px;">
      <div class="tableClass">
        <el-table :data="formdata" v-loading="loading" :header-cell-style="{background:'#eef1f6',color:'#606266'}"
          border style="width: 100%;">
          <el-table-column align="center" prop="id" label="序号" />
          <el-table-column align="center" prop="remark" label="名称" />
          <el-table-column align="center" prop="integral_num" label="积分" />
          <el-table-column align="center" prop="type_name" label="获得/使用" />
          <el-table-column align="center" prop="created_at" label="时间" />
        </el-table>

        <br>
        <!-- 分页 -->
        <div style="text-align: center;">
          <el-pagination background layout="prev, pager, next" @current-change="pageChange" :page-size="pageSize"
            :total="totalusers" />
        </div>
      </div>
    <!-- </el-card> -->
  </div>
</template>

<script>
  export default {
    data() {
      return {
        loading: false,
        formdata:[],
        userId:"",
        totalusers: 0, //总行数
        pageSize: 10, //每页几行
        startpage: 1, //起始页
      }
    },
    created() {
      this.userId = window.localStorage.getItem("userId")
    },
    mounted() {
      this.getIntegralRecordList()
    },
    methods: {

      //获取分页列表
      getIntegralRecordList(type) {
        let params = {
          "page": this.startpage,
          "limit": this.pageSize,
          "user_id": this.userId,
          "type":type
        }
        //调用后台提供的接口方法
        this.$api.getIntegralRecordList(params).then(res => {
          if (res.data.level == "success") {
            res.data
            this.$emit("onChange",{integral_balance:res.data.integral_balance,use_integral:res.data.use_integral})
            this.formdata = res.data.data
            console.log( this.formdata)
            this.totalusers = res.data.page_info.total
            this.loading = false
          } else {
            this.$message.error(res.data.message)
          }

        })
      },
      //分页 pageChange当前页发生改变触发函数
      async pageChange(page) {
        this.startpage = page
        this.loading = true
        //调用获取列表的方法
        this.getIntegralRecordList()
      },
    }
  }
</script>
<style scoped="scoped">

</style>
